<template>
	<view>
		<view class="themeLinearBgColor">
			<safeTopVue :backgroundColor="'var(--homePageBackground)'" />
			<appBar title="商户" :showLeft="false" backgroundColor=""></appBar>
			<uvDropdown :order="orderObj" :resultMenu="resultMenu" :defaultValue="defaultValue">
				<view class="rowStart gap10">
					<uv-icon name="search"></uv-icon>搜索
				</view>
			</uvDropdown>
		</view>
		<view class="w100">
			<RefashList ref="paging" :apiCallback="fetchData">
				<template #default="{ dataList }">
					<view class="w100 pall20">
						<view v-for="(item,index) in dataList" :key="index"
							@click="gotoPage(`/pages/tabbar/merchant/merchantInfo/merchantInfo?id=${index}`)">
							<merchantItem></merchantItem>
						</view>
					</view>
				</template>
			</RefashList>
		</view>
	</view>
</template>

<script>
	import uvDropdown from "@/components/uvDropdown/uvDropdown.vue";
	import merchantItem from "./merchantItem.vue";
	import RefashList from "@/components/RefashList/RefashList.vue";
	export default {
		components: {
			uvDropdown,
			RefashList,
			merchantItem
			
		},
		data() {
			return {
				orderObj: {
					person: {
						label: "人员",
						value: "all",
						activeIndex: 0,
						color: "#333",
						activeColor: "#fb5f46",
						child: [{
								label: "张三",
								value: "1",
							},
							{
								label: "李四",
								value: "2",
							},
							{
								label: "王五",
								value: "3",
							},
							{
								label: "赵六",
								value: "4",
							},
							
						],
					},
					shopStatus: {
						label: "店铺状态",
						value: "all",
						activeIndex: 0,
						color: "#333",
						activeColor: "#fb5f46",
						child: [{
								label: "全部",
								value: "all",
							},
							{
								label: "正常",
								value: "normal",
							},
							{
								label: "待审核",
								value: "waitAudit",
							},
							{
								label: "审核失败",
								value: "auditFail",
							},
							{
								label: "违规",
								value: "violation",
							},
						],
					},
				},
				resultMenu: [{
						name: "person",
						label: "人员",
						value: "person",
					},
					{
						name: "shopStatus",
						label: "店铺状态",
						value: "shopStatus",
					},
				],
				defaultValue: [0, "all", "0"],
			};
		},
		methods: {
			async fetchData({
				pageNo,
				pageSize,
				type
			}) {
				const params = {
					pageNo: pageNo,
					pageSize: pageSize,
					type: type,
				};

				const list = [{
						"title": "1",
						"detail": "测试信息1"
					},
					{
						"title": "2",
						"detail": "测试信息1"
					},
					{
						"title": "3",
						"detail": "测试信息1"
					},
					{
						"title": "4",
						"detail": "测试信息1"
					},
					{
						"title": "5",
						"detail": "测试信息1"
					},
					{
						"title": "6",
						"detail": "测试信息1"
					},
					{
						"title": "7",
						"detail": "测试信息1"
					},
					{
						"title": "8",
						"detail": "测试信息1"
					},
					{
						"title": "9",
						"detail": "测试信息1"
					},
					{
						"title": "10",
						"detail": "测试信息1"
					}
				]
				return {
					data: {
						list: list,
						pages: list.length,
					},
				};
			},
		}
	}
</script>

<style lang="scss">
	::v-deep .title {
		color: #FFFFFF;
	}
</style>